{extend name="$_mill_base_layout" /}

{block name="content"}
<div class="bottom" style="display: none">
    <div class="bottomBox s_center">
        {// 自定义HTML代码 }
        {$html|raw|default=''}
    </div>
</div>
<div class="index-content">
    <div class="index-left">
        <div class="index-div index-user">
            <div class="index-user-img">
                <img src="__HOME_IMG__/avatar.png">
            </div>
            <div>
                <div class="index-user-info">
                    <div class="index-user-info-username">
                        {:session('user_auth.role_name')}
                    </div>
                    <div class="index-user-info-role">
                        <i class="iconfont mill-zuobiao"></i>{:session('user_auth.role_name')}
                    </div>
                </div>
                <div class="index-user-info2">
                    <span class="index-user-info-group">归属部门:</span>
                    <span>{:session('user_auth.group_name')}</span>
                    <span class="index-user-info-mill">车间:</span>
                    <span>{:session('user_auth.mill_name')}</span>
                </div>
            </div>
        </div>
        <div class="index-div index-total">
            <div>
                <div class="index-title">
                    <i class="index-title-i iconfont mill-jiangpai"></i>
                    <div>基础统计</div>
                </div>

                <div class="index-number">
                    <div class="index-number-li">
                        客户数量：<span>35</span>
                    </div>
                    <div class="index-number-li">
                        工程数量：<span>35</span>
                    </div>
                    <div class="index-number-li">
                        批次数量：<span>35</span>
                    </div>

                </div>
            </div>
        </div>
        <div class="index-div index-show">
            <div class="index-title">
                <i class="index-title-i iconfont mill-ribao"></i>
                <div>产品详情</div>
                <a class="index-title-right"><i class="layui-icon layui-icon-next"></i></a>
            </div>

            <div class="index-number">
                <div class="index-number-li">产品数量：<span>30件</span></div>
                <div class="index-number-li">产品面积：<span>30平方</span></div>
                <div class="index-number-li">成交数量（发货）：<span>30件</span></div>
                <div class="index-number-li">成交面积（发货）：<span>30平方</span></div>
            </div>

        </div>
        <div class="index-div index-chart">
            <div class="index-title">
                <i class="index-title-i iconfont mill-buy"></i>
                <div>采购统计</div>
                <a class="index-title-right">快速入口<i class="layui-icon layui-icon-next"></i></a>
            </div>
            <div>
                <div id="index-chart" style="width: 350px; height: 375px;"></div>

                <script>
                    $(function (){
                        var datas = [
                            [
                                { name: '油漆', value: 5.6 },
                                { name: '粉末', value: 1 },
                                { name: '涂料', value: 0.8 },
                                { name: '木材', value: 0.5 },
                                { name: '铝卷', value: 0.5 },
                                { name: '火焰', value: 0.5 },
                                { name: '其它', value: 3.8 }
                            ]
                        ];
                        // 初始化 ECharts 实例
                        var pieChart = echarts.init(document.getElementById('index-chart'));

                        // 配置项
                        var option = {
                            legend: {
                                bottom: '5%',
                                left: 'center'
                            },
                            series: datas.map(function (data, idx) {

                                return {
                                    type: 'pie',

                                    top: 10 + '%',
                                    height: '60%',
                                    left: 'center',
                                    width: 350,
                                    itemStyle: {
                                        borderColor: '#fff',
                                        borderWidth: 1
                                    },
                                    label: {
                                        alignTo: 'edge',
                                        formatter: '{name|{b}}\n{time|{c} 小时}',
                                        minMargin: 5,
                                        edgeDistance: 10,
                                        lineHeight: 15,
                                        rich: {
                                            time: {
                                                fontSize: 10,
                                                color: '#999'
                                            }
                                        }
                                    },

                                    labelLine: {
                                        length: 5,
                                        length2: 2,
                                        maxSurfaceAngle: 8
                                    },
                                    labelLayout: function (params) {
                                        const isLeft = params.labelRect.x < pieChart.getWidth() / 2;
                                        const points = params.labelLinePoints;
                                        // Update the end point.
                                        points[2][0] = isLeft
                                                ? params.labelRect.x
                                                : params.labelRect.x + params.labelRect.width;
                                        return {
                                            labelLinePoints: points
                                        };
                                    },
                                    data: data
                                };
                            })
                        };

                        // 使用配置项显示图表
                        pieChart.setOption(option);

                        // 窗口大小改变时重置图表尺寸
                        window.addEventListener('resize', function () {
                            //pieChart.resize();
                        });
                    })

                </script>
            </div>
        </div>
    </div>
    <div class="index-right">
        <div class="index-menu">
            <div class="index-stat">

                <div class="index-stat-li index-stat-li-bg0">
                    <div class="index-stat-li-info">
                        <div class="index-stat-li-title">库存/油漆/KG</div>
                        <div class="index-stat-li-number">5.6KG</div>
                        <div class="index-stat-li-onyear">
                            <span>较上月</span>
                            <i class="lefttop-i iconfont mill-down"></i>

                        </div>
                    </div>
                    <img src="__HOME_IMG__/index-stat-li-bg0.png" class="index-stat-li-img" />
                </div>
                <div class="index-stat-li index-stat-li-bg1">
                    <div class="index-stat-li-info">
                        <div class="index-stat-li-title">库存/稀油/KG</div>
                        <div class="index-stat-li-number">5.6KG</div>
                        <div class="index-stat-li-onyear">
                            <span>较上月</span>
                            <i class="iconfont mill-up"></i>
                        </div>
                    </div>
                    <img src="__HOME_IMG__/index-stat-li-bg1.png" class="index-stat-li-img" />
                </div>
                <div class="index-stat-li index-stat-li-bg2">
                    <div class="index-stat-li-info">
                        <div class="index-stat-li-title">库存/粉末/KG</div>
                        <div class="index-stat-li-number">5.6KG</div>
                        <div class="index-stat-li-onyear">
                            <span>较上月</span>
                            <i class="iconfont mill-up"></i>
                        </div>
                    </div>
                    <img src="__HOME_IMG__/index-stat-li-bg2.png" class="index-stat-li-img" />
                </div>
                <div class="index-stat-li index-stat-li-bg3">
                    <div class="index-stat-li-info">
                        <div class="index-stat-li-title">库存/回收粉末/KG</div>
                        <div class="index-stat-li-number">5.6KG</div>
                        <div class="index-stat-li-onyear">
                            <span>较上月</span>
                            <i class="iconfont mill-up"></i>
                        </div>
                    </div>
                    <img src="__HOME_IMG__/index-stat-li-bg3.png" class="index-stat-li-img" />

                </div>

            </div>
            <div class="index-nav">
                <div class="index-nav-title">工作台</div>
                <div class="index-nav-ul">

                    <!--左侧导航-->
                    {if($table_lists)}
                    {php}$table_lists2 = [];$submenu_i = 1;{/php}


                    {// 一级导航}
                    {volist name="$table_lists[0]['child']" id="submenu"}

                    {empty name="submenu['online_hide']"}

                    {// 前3个图标为橙色，后面全为蓝色}
                    {php}$dch_nav_bg='index-nav-li-i-bg';{/php}
                    {if($submenu_i > 3)}{php}$dch_nav_bg='index-nav-li-i-bg1';{/php}{/if}
                    {// 判断是否有可显示的二级导航}
                    {php}$is_submenu2=get_menu_child_to($submenu);{/php}
                    <a class="index-nav-li" {if($submenu.url_value)}href="{$submenu.url_value}" target="{$submenu.url_target}"{/if}>
                        <div class="index-nav-li-i {$dch_nav_bg}"><i class="{$submenu.icon}"></i></div>
                        <div class="index-nav-li-content">
                            <div class="index-nav-li-title">{$submenu.title}</div>
                            <div class="index-nav-li-note">{$submenu.note}</div>

                        </div>
                    </a>

                    {// 前3个图标为橙色，后面全为蓝色}
                    {php}$submenu_i++;{/php}
                    {/empty}


                    {/volist}



                    {/if}

                    <!--<div class="gztdiv colf7">-->
                        <!--<div class="gztdivbg gztdivbg-color"><i class="iconfont mill-youqi"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">油漆</div>-->
                            <!--<div class="size12">油漆采购及库存情况查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7">-->
                        <!--<div class="gztdivbg gztdivbg-color"><i class="iconfont mill-fenmo"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">粉末</div>-->
                            <!--<div class="size12">粉末采购及库存情况查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7">-->
                        <!--<div class="gztdivbg gztdivbg-color"><i class="iconfont mill-md-wallpaper"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">转印纸</div>-->
                            <!--<div class="size12">转印纸采购及库存情况查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7">-->
                        <!--<div class="gztdivbg gztdivbg-color1"><i class="iconfont mill-a-fasfa-bullseye"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">铝卷</div>-->
                            <!--<div class="size12">铝卷采购及库存情况查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7">-->
                        <!--<div class="gztdivbg gztdivbg-color1"><i class="iconfont mill-a-fasfa-tablet"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">板材</div>-->
                            <!--<div class="size12">铝板采购及库存情况查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7">-->
                        <!--<div class="gztdivbg gztdivbg-color1"><i class="iconfont mill-riLine-shape-line"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">型材</div>-->
                            <!--<div class="size12">型材采购及库存情况查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7 martop22">-->
                        <!--<div class="gztdivbg gztdivbg-color1"><i class="iconfont mill-a-fasfa-flask"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">化工</div>-->
                            <!--<div class="size12">化工采购及库存情况查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7 martop22">-->
                        <!--<div class="gztdivbg gztdivbg-color1"><i class="iconfont mill-ze-logistics"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">生产物资</div>-->
                            <!--<div class="size12">生产物资采购及库存情况查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7 martop22">-->
                        <!--<div class="gztdivbg gztdivbg-color1"><i class="iconfont mill-folder"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">办公物资</div>-->
                            <!--<div class="size12">办公物资采购及库存情况查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7">-->
                        <!--<div class="gztdivbg gztdivbg-color"><i class="iconfont mill-more"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">采购单</div>-->
                            <!--<div class="size12">采购管理...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="gztdiv colf7">-->
                        <!--<div class="gztdivbg gztdivbg-color1"><i class="iconfont mill-buy"></i></div>-->
                        <!--<div class="marto">-->
                            <!--<div class="fontWeight">仓库记录</div>-->
                            <!--<div class="size12">出入库及退还记录查询...</div>-->

                        <!--</div>-->
                    <!--</div>-->
                </div>
            </div>

        </div>
        <div class="index-right-bottom">
            <div class="index-right-bottom-title">待办事项</div>
            <div class="index-right-bottom-content">
                <div class="index-right-bottom-content-left">

                    <ul>
                        <li>
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>
                            <div class="li-btn">
                                <a>查看</a>
                            </div>

                        </li>
                        <li>
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>
                            <div class="li-btn">
                                <a>查看</a>
                            </div>

                        </li>
                        <li>
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>
                            <div class="li-btn">
                                <a>查看</a>
                            </div>

                        </li>
                        <li>
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>
                            <div class="li-btn">
                                <a>查看</a>
                            </div>

                        </li>
                        <li class="li-more">
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>
                            <div class="li-btn">
                                <a>查看</a>
                            </div>

                        </li>
                        <li class="li-more">
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>
                            <div class="li-btn">
                                <a>查看</a>
                            </div>

                        </li>
                    </ul>

                </div>
                <div class="index-right-bottom-content-right">

                    <ul>
                        <li class="li-more">
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>

                        </li>
                        <li class="li-more">
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>

                        </li>
                        <li class="li-more">
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>

                        </li>
                        <li class="li-more">
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>

                        </li>
                        <li class="li-more">
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>

                        </li>
                        <li class="li-more">
                            <div class="li-title">
                                「待收货」采购订单等待收货(XXR-0063重庆星旭铝业有限公司)油漆
                            </div>
                            <div class="li-time">
                                2025.02.03
                            </div>

                        </li>
                    </ul>
                </div>
            </div>

        </div>

    </div>
</div>
<script>
    $(function(){
        $('.nav-left').hide();
    })
</script>
{/block}